import { useUploads } from '../context/uploads-context'
import { UploadsActionDialog } from './uploads-action-dialog'
import { UploadsDeleteDialog } from './uploads-delete-dialog'
import { UploadsEditDialog } from './uploads-edit-dialog'

export function UploadsDialogs() {
  const { open, setOpen, currentRow, setCurrentRow } = useUploads()
  return (
    <>
      <UploadsActionDialog
        key='upload-add'
        open={open === 'add'}
        onOpenChange={() => setOpen('add')}
      />

      {currentRow && (
        <>
          <UploadsEditDialog
            key={`upload-edit-${currentRow.id}`}
            open={open === 'edit'}
            onOpenChange={() => {
              setOpen('edit')
              setTimeout(() => {
                setCurrentRow(null)
              }, 500)
            }}
            currentRow={currentRow}
          />
          
          <UploadsDeleteDialog
            key={`upload-delete-${currentRow.id}`}
            open={open === 'delete'}
            onOpenChange={() => {
              setOpen('delete')
              setTimeout(() => {
                setCurrentRow(null)
              }, 500)
            }}
            currentRow={currentRow}
          />
        </>
      )}
    </>
  )
}
